<!doctype html>
<html>
<head>
<meta charset="utf-8">
{include_core file="lib/seoinfo.html" title="第三方绑定帐号" keywords="" description=""}
{load_js file="jquery-1.7.1.min.js"}
{load_js file="common.js"}
{load_js file="style.js"}
{load_css file="css/base.css"}
{load_css file="css/common.css"}
{load_css file="css/style.css"}
</head>
<body>
<div id="wrap" class="wrap1">
  <div id="header">
    <div class="login-head-inner clearfix">
      <h1 class="logo"><a href="{AnUrl('')}"><img src="{$smarty.const.SITE_URL}/images/logo.png" width="112" height="36"></a></h1>
      <a href="javascript:void(0);" class="link">第三方绑定帐号</a>
    </div>
  </div>
  <div id="container">
    <div class="register-box clearfix associate2">
      <div class="register-left">
        <div class="register-head clearfix">
          <div class="r-h-inner"><a href="javascript:void(0);" class="curr">手机绑定</a> <a href="javascript:void(0);">邮箱绑定</a> </div>
        </div>
        <div class="input-box phone">
          <form action = "{AnUrl('openapi/index/create_user')}" method="post" id="js_register_m">
            <p class="clearfix">
              <span class="name">用户名：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="username" id="js_usernameM" class="txt txt1"/>
              </span>
              <span class="span1"></span>
            </p>
            <p class="clearfix">
              <span class="name">手机号：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="mobile" id="js_mobileM" class="txt txt1"/>
              </span>
              <a href="javascript:void(0);" id="getCode" value="on" class="btn1 validation-code clearfix">获取验证码</a>
            </p>
            <p class="clearfix"><span class="name">验证码：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="code" id="js_codeM" class="txt txt2"/>
              </span>
              <span class="span1">请输入手机收到的验证码</span>
            </p>
            <p class="clearfix"><a href="javascript:void(0);" id="register-mobile" class="btn2 register-btn">提交</a>
              <span class="span2">点击“提交”，即表示您同意并愿意遵守用户协议</span>
            </p>
        </form>
        </div>
        <div class="input-box email hidden">
          <form action = "{AnUrl('openapi/index/create_user')}" method="post" id="js_register_e">
            <p class="clearfix">
              <span class="name">用户名：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="username" id="js_usernameE" class="txt txt1"/>
              </span>
              <span class="span1"></span>
            </p>
            <p class="clearfix"><span class="name">邮箱：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="email" id="js_emailE" class="txt txt1"/>
              </span>
              <span class="span1"></span>
            </p>
            <p class="clearfix">
              <span class="name">验证码：</span>
              <span class="txt-wrap clearfix">
                <input type="text" value="" name="captcha" id="captchaCode" class="txt txt2"/>
              </span>
              <a href="javascript:void(0);" id="imgCode" class="v-img">
                <img src="{AnUrl('captcha')}" width="100" height="31">
              </a>
              <span class="span1">点击图片刷新验证码</span>
            </p>
            <p class="clearfix">
              <a href="javascript:void(0);" class="btn2 register-btn" id="register-email">提交</a>
              <span class="span2">点击“提交”，即表示您同意并愿意遵守用户协议</span>
            </p>
          </form>
        </div>
      </div>
    </div>
    <!--end register-box-->
      {include_core file="lib/bottom_copy.html"}
  </div>
</div>
<script>
$(function(){

  var user_id = {$user_id};

  $('#imgCode').click(function(){
    var rand = new Date().getTime();
    $("#imgCode img").attr("src", "{AnUrl('captcha')}&t="+rand);
  });

  var user_off = mobile_off = email_off = code_off = captchaCode_off = 1;
  
  $('#js_usernameM, #js_usernameE').blur(function(){
    var username = $.trim($(this).val());
    var userLen  = getStringLen(username);
    var userNext = $(this).parent().next();
    if(username == '') {
      user_off = 1;
      userNext.html('您输入的用户名不能为空').addClass('prompt-red');
      return ;
    } else {
      userNext.html('');
    }
    if(checkStr(username, 'mail')) {
      user_off = 1;
      userNext.html('您输入的用户名不能为邮箱！').addClass('prompt-red');
      return ;
    } else {
      userNext.html('');
    }
    if(userLen < 6 || userLen > 20) {
      user_off = 1;
      userNext.html('用户名应在6个到20个字符之间').addClass('prompt-red');
      return ;
    } else {
      userNext.html('');
    }
    if(!checkStr(username, 'name')) {
      user_off = 1;
      userNext.html('您输入的用户名格式不正确').addClass('prompt-red');
      return ;
    } else {
      userNext.html('');
    }
    if(is_number(username)) {
      user_off = 1;
      userNext.html('用户名不能为纯数字').addClass('prompt-red');
      return ;
    } else {
      userNext.html('');
    }
    $.post(
        "{AnUrl('user/register/ajax_username')}",
        { username:username, user_id:user_id },
        function(data){
          if(data.info == 'error') {
            user_off = 1;
            userNext.html(data.msg).addClass('prompt-red');
            return;
          } else {
            user_off = 0;
            userNext.html('');
          }
        },'json');
  });

  $('#js_emailE').blur(function(){
    var email = $.trim($(this).val());
    var emailNext = $(this).parent().next();
    if(email == '') {
      email_off = 1;
      emailNext.html('您输入的邮箱不能为空').addClass('prompt-red');
      return ;
    } else {
      emailNext.html('');
    }
    if(!checkStr(email, 'mail')) {
      email_off = 1;
      emailNext.html('您输入的邮箱格式不正确').addClass('prompt-red');
      return ;
    } else {
      emailNext.html('');
    }
    $.post(
        "{AnUrl('user/register/ajax_email')}",
        { email:email },
        function(data) {
          if(data.info == 'error') {
            email_off = 1;
            emailNext.html(data.msg).addClass('prompt-red');
            return ;
          } else {
            email_off = 0;
            emailNext.html('');
          }
        },'json'
    )
  });

  $('#js_mobileM').blur(function(){
    var mobile = $.trim($(this).val());
    var mobileNext = $('#js_codeM').parent().next();
    if(mobile == '') {
      mobile_off = 1;
      mobileNext.html('您输入的手机号不能为空').addClass('prompt-red');
      return ;
    } else {
      // mobile_off = 0;
      mobileNext.html('');
    }
    if(!checkStr(mobile, 'mobile')) {
      mobile_off = 1;
      mobileNext.html('您输入的手机号格式不正确').addClass('prompt-red');
      return ;
    } else {
      // mobile_off = 0;
      mobileNext.html('');
    }
    $.post(
        "{AnUrl('user/register/ajax_mobile')}",
        { mobile:mobile },
        function(data) {
          if(data.info == 'error') {
            mobile_off = 1;
            mobileNext.html(data.msg).addClass('prompt-red');
            return;
          } else {
            mobile_off = 0;
            mobileNext.html('');
          }
        },'json'
    );
  });

  $('#js_codeM').blur(function(){
    var code = $.trim($(this).val());
    var mobile = $.trim($('#js_mobileM').val());
    var codeNext = $(this).parent().next();
    if(mobile == '') {
      code_off = 1;
      codeNext.html('您输入的手机号不能为空').addClass('prompt-red');
      return ;
    } else {
      codeNext.html('');
    }
    if(!checkStr(mobile, 'mobile')) {
      code_off = 1;
      codeNext.html('您输入的手机号格式不正确').addClass('prompt-red');
      return ;
    } else {
      codeNext.html('');
    }
    if(code == '') {
      code_off = 1;
      codeNext.html('您输入的验证码不能为空').addClass('prompt-red');
      return ;
    } else {
      codeNext.html('');
    }
    $.post(
        "{AnUrl('user/register/ajax_code')}",
        { code:code, mobile:mobile, code_type:'perfect' },
        function(data) {
          if(data.info == 'error') {
            code_off = 1;
            codeNext.html(data.msg).addClass('prompt-red');
            return;
          } else {
             code_off = 0;
             codeNext.html('');
          }
        },'json'
    );
  })

  $('#captchaCode').blur(function(){
    var captchaCode = $.trim($(this).val());
    var captchaCodeNext = $(this).parent().next().next();
    if(captchaCode == '') {
      captchaCode_off = 1;
      captchaCodeNext.html('您输入的验证码不能为空').addClass('prompt-red');
      return ;
    } else {
      captchaCodeNext.html('');
    }
    $.post(
        "{AnUrl('captcha/check')}",
        { captcha:captchaCode },
        function(data) {
          if(data.info == 'error') {
            captchaCode_off = 1;
            captchaCodeNext.html(data.msg).addClass('prompt-red');
            return;
          } else {
             captchaCode_off = 0;
             captchaCodeNext.html('');
          }
        },'json'
    );
  });

  $('#register-mobile').click(function(){
    $(this).html('正在提交...');
    $('#js_usernameM').trigger('blur');
    $('#js_mobileM').trigger('blur');
    $('#js_codeM').trigger('blur');
    if(user_off == 0 && mobile_off == 0 && 0 == code_off) {
      $('#js_register_m').submit();
    } else {
      $(this).html('提交');
    }
  });
  
  $('#register-email').click(function(){
    $(this).html('正在提交...');
    $('#js_usernameE').trigger('blur');
    $('#js_emailE').trigger('blur');
    $('#captchaCode').trigger('blur');
    if(user_off == 0 && email_off == 0 && captchaCode_off == 0) {
      $('#js_register_e').submit();
    } else {
      $(this).html('提交');
    }
  });
//获取验证码
  $('#getCode').click(function(){
    var mobile = $.trim($('#js_mobileM').val());
    $('#js_usernameM').trigger('blur');
    $('#js_mobileM').trigger('blur');
    var codeNext = $('#js_codeM').next();
    if(user_off == 0 && mobile_off == 0) {
      if($(this).attr('value') == 'on') {
        var time = 59;
        $('#getCode').html(time).attr('value', 'off');
        var Timer=setInterval(function(){
          if(time > 0){
            time--;
            $('#getCode').html(time).attr('value', 'off');
          } else {
            $('#getCode').html('获取').attr('value', 'on');
            clearInterval(Timer);
          }
        },1000);
      $.post(
          "{AnUrl('user/register/sendRegsms')}",
          { 'mobile':mobile, 'send_type':'perfect' },
          function(data){
            if(data.info == 'error') {
              codeNext.html(data.msg).parent().addClass('error');
            } else {
              codeNext.html('');
            }
          },'json');
      }
    }
  });
});
</script>
</body>
</html>
